<template>
  <div>
    <router-link to="/job">
        <van-icon name="notes-o" />
        <span>职位</span> 
    </router-link>&nbsp;&nbsp;&nbsp;
    <router-link to="/have">
        <van-icon name="point-gift-o" />
        <span>有了</span>
    </router-link>&nbsp;&nbsp;&nbsp;
    <router-link to="/msg">
        <van-icon name="comment-o" />
        <span>消息</span>
    </router-link>&nbsp;&nbsp;&nbsp;
    <router-link to="/mine">
        <van-icon name="user-o" />
        <span>我的</span>
    </router-link>&nbsp;&nbsp;&nbsp;
  </div>
</template>

<script>
export default {

}
</script>

<style scoped>
    div{
        width: 100%;
        height: 0.5rem;
        background-color: white;
        position: fixed;
        bottom: 0rem;
        display: flex;
        justify-content: space-around;
        align-items: center;
        border-top: 0.01rem solid #ddd;
        z-index: 10;
    }
    a{
        text-decoration: none;
        flex:1;
        text-align: center;
        color: #000;
        font-size: 0.18rem;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    a > i {
        font-size: 0.2rem;
    }
    a > span {
        font-size: 0.12rem;
    }
    .router-link-active{
        color: #f3420f;
    }
</style>